<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('流程办理历史列表')" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>流程标题：</label>
                                <input type="text" name="actTitle"/>
                            </li>
                            <li>
                                <label>流程名称：</label>
                                <input type="text" name="flowName"/>
                            </li>

                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>


            <div class="col-sm-12 select-table table-bordered">
                <table id="bootstrap-table"></table>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
     <th:block th:include="include :: bootstrap-table-fixed-columns-js"/>

    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('activity:PROCINST:edit')}]];
        var removeFlag = [[${@permission.hasPermi('activity:PROCINST:remove')}]];
        var prefix = ctx + "activity/PROCINST";

        $(function() {
            var options = {
                url: prefix + "/handleHiList",
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                exportUrl: prefix + "/export",
                modalName: "流程实例",
                /*fixedColumns:true,
                fixedRightNumber:1,*/
                height: $(window).height()-110,
                columns: [{
                    checkbox: true
                },
                {
                    field: 'procInstId',
                    title: '流程实例Id',
                    visible: false
                },
                {
                    field: 'actTitle',
                    title: '流程标题'
                },
                {
                    field: 'flowName',
                    title: '流程名称'
                },
                {
                    field: 'taskName',
                    title: '任务名称'
                },
                {
                    field: 'assignee',
                    title: '当前任务人'
                },
                /*{
                     field: 'suspensionState',
                     title: '是否挂起',
                     formatter: function(value) {
                        if(value==1){
                            return '正常';
                        }else if(value==2){
                            return '挂起';
                        }else{
                            return '';
                        }
                     }
                 },*/
                {
                      field: 'endTime',
                      title: '状态',
                      formatter: function(value) {
                         if(value==null||value=='null'||value==''){
                             return '运行中';
                         }else{
                             return '已结束';
                         }
                      }
                 },
                    {
                        field: 'taskCreatTime',
                        title: '任务创建时间'
                    },
                {
                    field: 'startUserId',
                    title: '创建人',
                    formatter: function(value) {
                        var startUser = value;
                        if(startUser!=null&&startUser.indexOf(":")>0){
                            startUser = startUser.substring(startUser.indexOf(":")+1);
                        }
                        return startUser;
                    }
                },
                {
                    field: 'handleTime',
                    title: '处理时间'
                },
                {
                    field: 'endTime',
                    title: '持续时间',
                    formatter: function(value,row) {
                        if(row.taskCreatTime==''||row.handleTime == ''||row.taskCreatTime=='null'||row.handleTime == 'null'||row.taskCreatTime==null||row.handleTime == null){
                            return '';
                        }

                        return getRemainderTime(row.taskCreatTime,row.handleTime);
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        /*actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="viewTaskImg(\'' + row.procInstId + '\')"><i class="fa fa-edit"></i>流程图</a> ');
                        actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.addTab(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a> ');*/
                        actions.push('<a class="btn btn-default btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="viewTaskRecord(\'' + row.procInstId + '\')"><i class="fa fa-info-circle">流程详情</i></a> ');
                        return actions.join('');
                    }
                }]
            };
            $.table.init(options);
        });


        function flowDetail(){
            $.modal.openFull("流程详情","");
        }

        function viewTaskImg(processInstanceId,width,height){
            var title= "查看流程";
            var url = prefix+"/getHandleTaskImgInfo/"+processInstanceId;
            //$.modal.openFull("查看流程", url);
            // 如果是移动端，就使用自适应大小弹窗
            if ($.common.isMobile()) {
                width = 'auto';
                height = 'auto';
            }
            if ($.common.isEmpty(title)) {
                title = false;
            }
            if ($.common.isEmpty(url)) {
                url = "/404.html";
            }
            if ($.common.isEmpty(width)) {
                width = 800;
            }
            if ($.common.isEmpty(height)) {
                height = ($(window).height() - 50);
            }
            var index = layer.open({
                type: 2,
                area: [800 + 'px', $(window).height() - 50 + 'px'],
                fix: false,
                //不固定
                maxmin: true,
                shade: 0.3,
                title: title,
                content: url,
                // 弹层外区域关闭
                shadeClose: true,
                yes: function(index, layero) {
                    var iframeWin = layero.find('iframe')[0];
                    iframeWin.contentWindow.submitHandler(index, layero);
                },
                cancel: function(index) {
                    return true;
                }
            });
            layer.full(index);
        }
        function viewTaskRecord(procInstId){

            var options = {
                title: '流程记录',
                width: "880",
                url:"/activity/RECORD/"+procInstId//,
                // callBack: doSubmit
            };
            //$.modal.openOptions(options);
            $.modal.openTab("流程记录", options.url);

            // var url = ctx + "base/supplier/selectSupplier";
            // $.modal.open("选择供应商", url);
        }



        function getRemainderTime (startTime,endTime){
            var s1 = new Date(startTime.replace(/-/g, "/"));
            var  s2 = new Date(endTime.replace(/-/g, "/"));
            //多少秒
            var runTime = parseInt((s2.getTime() - s1.getTime()) / 1000);
            var year = Math.floor(runTime / 86400 / 365);
            runTime = runTime % (86400 * 365);
            //var month = Math.floor(runTime / 86400 / 30);
            //runTime = runTime % (86400 * 30);
            var day = Math.floor(runTime / 86400);
            runTime = runTime % 86400;
            var hour = Math.floor(runTime / 3600);
            runTime = runTime % 3600;
            var minute = Math.floor(runTime / 60);
            runTime = runTime % 60;
            var second = runTime;
            // console.log(year,month,day,hour,minute,second);
            var diffTime = "";
            if(year!=0){
                diffTime+=year+"年";
            }
            if(day!=0){
                diffTime+=day+"天";
            }
            if(hour!=0){
                diffTime+=hour+"时";
            }
            if(minute!=0){
                diffTime+=minute+"分";
            }
            if(second!=0){
                diffTime+=second+"秒";
            }
            return diffTime;
        }
    </script>
</body>
</html>